﻿<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:FrontDisplay.Controls"
    x:Class="FrontDisplay.Music.PlaylistPage"
    Width="800" Height="500" FontFamily="Tahoma">
	<UserControl.Resources>

        <SolidColorBrush x:Key="ForegroundBrush" Color="#99FFFFFF"/>
        <SolidColorBrush x:Key="SelectedBackgroundBrush" Color="#FF888888" Opacity="0.6"/>
        <SolidColorBrush x:Key="SelectedForegroundBrush" Color="#FFFFFFFF"/>
        <SolidColorBrush x:Key="ScrollBarPageButtonBrush" Opacity="0.1" Color="{StaticResource {x:Static SystemColors.ControlLightLightColorKey}}"/>

        <Style x:Key="ListBoxStyle" TargetType="{x:Type ListBox}">
			<Setter Property="Background" Value="Transparent"/>
			<Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
			<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden"/>
			<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
			<Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
			<Setter Property="VerticalContentAlignment" Value="Center"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type ListBox}">
						<ScrollViewer Focusable="false" Padding="{TemplateBinding Padding}" Template="{DynamicResource ScrollViewerControlTemplate}">
							<ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
						</ScrollViewer>
						<ControlTemplate.Triggers>
							<Trigger Property="IsGrouping" Value="true">
								<Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		
		<ControlTemplate x:Key="ScrollViewerControlTemplate" TargetType="{x:Type ScrollViewer}">
			<Grid x:Name="Grid" Background="{TemplateBinding Background}">
				<Grid.ColumnDefinitions>
					<ColumnDefinition Width="*"/>
					<ColumnDefinition Width="Auto"/>
				</Grid.ColumnDefinitions>
				<Grid.RowDefinitions>
					<RowDefinition Height="*"/>
					<RowDefinition Height="Auto"/>
				</Grid.RowDefinitions>
				<ScrollContentPresenter Margin="{TemplateBinding Padding}" x:Name="PART_ScrollContentPresenter" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Grid.Column="0" Grid.Row="0" CanContentScroll="{TemplateBinding CanContentScroll}" CanHorizontallyScroll="False" CanVerticallyScroll="False"/>
                <Rectangle Fill="Transparent" VerticalAlignment="Stretch" HorizontalAlignment="Right" Width="128" />
				<ScrollBar Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" x:Name="PART_VerticalScrollBar" Grid.Column="1" Grid.Row="0" ViewportSize="{TemplateBinding ViewportHeight}" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Value="{Binding Path=VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" AutomationProperties.AutomationId="VerticalScrollBar" Style="{DynamicResource ScrollBarStyle}"/>
				<ScrollBar Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" x:Name="PART_HorizontalScrollBar" Grid.Column="0" Grid.Row="1" Orientation="Horizontal" ViewportSize="{TemplateBinding ViewportWidth}" Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Value="{Binding Path=HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" AutomationProperties.AutomationId="HorizontalScrollBar"/>
			</Grid>
		</ControlTemplate>
		
		<Style x:Key="ScrollBarLineButtonStyle" TargetType="{x:Type RepeatButton}">
			<Setter Property="OverridesDefaultStyle" Value="true"/>
			<Setter Property="Background" Value="Transparent"/>
            <Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
            <Setter Property="MinWidth" Value="0"/>
			<Setter Property="MinHeight" Value="0"/>
			<Setter Property="IsTabStop" Value="false"/>
			<Setter Property="Focusable" Value="false"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type RepeatButton}">
						<Viewbox Margin="5">
							<Grid Background="Transparent">
								<Ellipse Stroke="{TemplateBinding Foreground}" Visibility="Hidden" x:Name="Ellipse" />
								<Path Margin="3" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}"/>
							</Grid>
						</Viewbox>
						<ControlTemplate.Triggers>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Visibility" TargetName="Ellipse" Value="Visible"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Foreground" Value="Transparent"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>

		<Style x:Key="VerticalScrollBarPageButtonStyle" TargetType="{x:Type RepeatButton}">
			<Setter Property="OverridesDefaultStyle" Value="true"/>
			<Setter Property="IsTabStop" Value="false"/>
			<Setter Property="Focusable" Value="false"/>
			<Setter Property="MinWidth" Value="128"/>
			<Setter Property="MinHeight" Value="128"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type RepeatButton}">
						<Rectangle Width="64" x:Name="PageButtonBackground" Fill="Transparent" RadiusX="15" RadiusY="15" Opacity="0.2"/>
						<ControlTemplate.Triggers>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Fill" TargetName="PageButtonBackground" Value="{DynamicResource ForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>

		<Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Thumb}">
				        <Rectangle Width="64" Fill="{DynamicResource ForegroundBrush}" Stroke="{DynamicResource ForegroundBrush}" RadiusY="5" RadiusX="5"/>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		
		<Style x:Key="HorizontalScrollBarPageButtonStyle" TargetType="{x:Type RepeatButton}">
			<Setter Property="OverridesDefaultStyle" Value="true"/>
			<Setter Property="IsTabStop" Value="false"/>
			<Setter Property="Focusable" Value="false"/>
			<Setter Property="MinHeight" Value="128"/>
			<Setter Property="MinWidth" Value="128"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type RepeatButton}">
						<Rectangle Height="64" x:Name="PageButtonBackground" Fill="Transparent" RadiusX="15" RadiusY="15" Opacity="0.2"/>
						<ControlTemplate.Triggers>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Fill" TargetName="PageButtonBackground" Value="{StaticResource ForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		
		<Style x:Key="ScrollBarStyle" TargetType="{x:Type ScrollBar}">
			<Setter Property="Stylus.IsPressAndHoldEnabled" Value="false"/>
			<Setter Property="Stylus.IsFlicksEnabled" Value="false"/>
			<Setter Property="Background" Value="Transparent"/>
            <Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
            <Setter Property="BorderThickness" Value="0"/>
			<Setter Property="Width" Value="128"/>
			<Setter Property="MinWidth" Value="128"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type ScrollBar}">
						<Grid Background="{TemplateBinding Background}">
							<Grid.RowDefinitions>
								<RowDefinition MaxHeight="128"/>
								<RowDefinition Height="0.00001*"/>
								<RowDefinition MaxHeight="128"/>
							</Grid.RowDefinitions>
							<Viewbox Stretch="Fill">
								<RepeatButton MinWidth="128" Style="{StaticResource ScrollBarLineButtonStyle}" Height="128" Content="M 0 4 L 7 4 L 3.5 0 Z" Command="{x:Static ScrollBar.LineUpCommand}"/>
							</Viewbox>
							<Rectangle Width="64" Fill="{StaticResource ScrollBarPageButtonBrush}" Grid.Row="1" RadiusY="15" RadiusX="15"/>
							<Track x:Name="PART_Track" Grid.Row="1" IsDirectionReversed="true">
								<Track.DecreaseRepeatButton>
									<RepeatButton Style="{StaticResource VerticalScrollBarPageButtonStyle}" Command="{x:Static ScrollBar.PageUpCommand}"/>
								</Track.DecreaseRepeatButton>
								<Track.IncreaseRepeatButton>
									<RepeatButton Style="{StaticResource VerticalScrollBarPageButtonStyle}" Command="{x:Static ScrollBar.PageDownCommand}"/>
								</Track.IncreaseRepeatButton>
								<Track.Thumb>
									<Thumb Style="{StaticResource ScrollBarThumb}"/>
								</Track.Thumb>
							</Track>
							<Viewbox Stretch="Fill" Grid.Row="2">
								<RepeatButton MinWidth="128" Style="{StaticResource ScrollBarLineButtonStyle}" Height="128" Content="M 0 0 L 3.5 4 L 7 0 Z" Command="{x:Static ScrollBar.LineDownCommand}"/>
							</Viewbox>
						</Grid>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
			<Style.Triggers>
				<Trigger Property="Orientation" Value="Horizontal">
					<Setter Property="Width" Value="Auto"/>
					<Setter Property="MinWidth" Value="0"/>
					<Setter Property="Height" Value="128"/>
					<Setter Property="MinHeight" Value="128"/>
					<Setter Property="Template">
						<Setter.Value>
							<ControlTemplate TargetType="{x:Type ScrollBar}">
								<Grid Background="{TemplateBinding Background}">
									<Grid.ColumnDefinitions>
										<ColumnDefinition MaxWidth="128"/>
										<ColumnDefinition Width="0.00001*"/>
										<ColumnDefinition MaxWidth="128"/>
									</Grid.ColumnDefinitions>
									<Viewbox Stretch="Fill">
										<RepeatButton MinHeight="128" Style="{StaticResource ScrollBarLineButtonStyle}" Width="128" Content="M 0 4 L 4 8 L 4 0 Z" Command="{x:Static ScrollBar.LineLeftCommand}"/>
									</Viewbox>
									<Rectangle Width="64" Fill="{StaticResource ScrollBarPageButtonBrush}" Grid.Column="1" RadiusX="15" RadiusY="15"/>
									<Track x:Name="PART_Track" Grid.Column="1">
										<Track.DecreaseRepeatButton>
											<RepeatButton Style="{StaticResource HorizontalScrollBarPageButtonStyle}" Command="{x:Static ScrollBar.PageLeftCommand}"/>
										</Track.DecreaseRepeatButton>
										<Track.IncreaseRepeatButton>
											<RepeatButton Style="{StaticResource HorizontalScrollBarPageButtonStyle}" Command="{x:Static ScrollBar.PageRightCommand}"/>
										</Track.IncreaseRepeatButton>
										<Track.Thumb>
											<Thumb Style="{StaticResource ScrollBarThumb}"/>
										</Track.Thumb>
									</Track>
									<Viewbox Stretch="Fill" Grid.Column="2">
										<RepeatButton MinHeight="128" Style="{StaticResource ScrollBarLineButtonStyle}" Width="128" Content="M 0 0 L 0 8 L 4 4 Z" Command="{x:Static ScrollBar.LineRightCommand}"/>
									</Viewbox>
								</Grid>
							</ControlTemplate>
						</Setter.Value>
					</Setter>
				</Trigger>
			</Style.Triggers>
		</Style>
		<Style TargetType="{x:Type ListBoxItem}">
			<Setter Property="Background" Value="Transparent"/>
			<Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
			<Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
			<Setter Property="Padding" Value="2,0,0,0"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type ListBoxItem}">
						<Border SnapsToDevicePixels="true" x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
							<ContentPresenter MouseLeftButtonDown="PlaylistItemMouseLeftButtonDown" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
						</Border>
						<ControlTemplate.Triggers>
							<Trigger Property="IsSelected" Value="true">
								<Setter Property="Background" TargetName="Bd" Value="{DynamicResource SelectedBackgroundBrush}"/>
								<Setter Property="Foreground" Value="{DynamicResource SelectedForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		
	</UserControl.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="40" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <ListBox VirtualizingStackPanel.IsVirtualizing="True" x:Name="Playlist" Background="Transparent" Foreground="Brown" FontSize="51" Style="{DynamicResource ListBoxStyle}" Grid.Column="1"></ListBox>
        <Rectangle Fill="Transparent" HorizontalAlignment="Left" Width="110" Grid.Column="0" />
        <TextBlock x:Name="PlayerName" Opacity="0.5" FontSize="30" RenderTransformOrigin="0,0" Text="Winamp" Width="300" HorizontalAlignment="Left" VerticalAlignment="Bottom" Grid.ColumnSpan="2" Margin="0,0,0,-20" >
    		<TextBlock.RenderTransform>
    			<TransformGroup>
    				<RotateTransform Angle="-90"/>
                    <ScaleTransform ScaleX="1" ScaleY="1.2" />
    			</TransformGroup>                
    		</TextBlock.RenderTransform>
        </TextBlock>
        <Label Style="{DynamicResource MediaButton}" MouseLeftButtonDown="BackButtonMouseLeftButtonDown" HorizontalAlignment="Left" Grid.ColumnSpan="2" Width="75" Margin="0">
            <local:OutlineTextBlock FontFamily="Webdings" FontSize="50" Text="3  " HorizontalAlignment="Left" StrokeThickness="1" />
        </Label>
    </Grid>
</UserControl>
